﻿<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<head>
<title>新增问题</title>
<link href="/static/css/wangEditor.min.css" rel="stylesheet"/>
<style>
.form-control {
	width: 70%;
}
#causeMethod{
	width:800px;
	z-index:1;
}
</style>
<script type="text/javascript" src="/static/js/wangEditor.js"></script>
<script type="text/javascript">
	$(function(){
		var E = window.wangEditor;
        var editor = new E('#causeMethod');
        //editor.customConfig.debug = true
		editor.customConfig.showLinkImg = false;
		editor.customConfig.uploadImgServer = '/problem/upload';
		editor.customConfig.uploadFileName = 'yourFileName';
		editor.customConfig.uploadImgHeaders = {
			'Accept' : 'multipart/form-data'
		}
		editor.customConfig.uploadImgHooks = {
				customInsert: function (insertImg, result, editor) {
			        var url = result.data;
			        alert(url);
			        insertImg(url);
			    }
		}
        editor.create();
		
		$("#submitBt").click(function() {
			var title = $("#title").val();
			var systemObj = document.getElementById("systemId");
			var systemId = systemObj.options[systemObj.selectedIndex].value;
			var systemName = systemObj.options[systemObj.selectedIndex].text;
			$("#systemName").val(systemName);
			var mainContent = $("#mainContent").val();
			$.post("${basePath}/problem/addProblem", $("#addProblemForm").serialize(), function(data) {
				if (data.success) {
					window.location.href="/problem/toAddProblem";
				}
			});
		});
	});
	
	$(function() {
		$("#productId").change(function(){
			var productId = $("#productId").find("option:selected").val();
			var htm="";
			if (productId !=0) {
				$.post("${basePath}/module/moduleListByProductId",{productId:productId},function(result){
					if(result.code==200){
						var moduleList = result.data;
						if(moduleList.length==0){
							htm+="<option value='-1'>无..</option>";
							$("#moduleId").html(htm);
							return;
						}
						for(var i=0;i<moduleList.length;i++){
							htm+="<option value='"+moduleList[i].id+"'>"+moduleList[i].moduleName+"</option>";
						}
						$("#moduleId").html(htm);
					}
				});
			}else{
				htm+="<option value='0' selected='selected'>--请选择--</option>";
				$("#moduleId").html(htm);
			}
		});
		$("#problemTypeId").change(function(){
			var problemTypeId = $("#problemTypeId").find("option:selected").val();
			if (problemTypeId !=0) {
				$.post("${basePath}/problemType/getProblemTypeById",{id:problemTypeId},function(result){
					if(result.code==200){
						$("#problemTypeDesc").val(result.data.problemTypeDesc);
					}else{
						$("#problemTypeDesc").val("无...");
					}
				});
			}else{
				$("#problemTypeDesc").val("");
			}
		});
		$("#clearBtn").click(function() {
			// 清空文本框
			$("#clearDiv").find('input[type="text"]').each(function() {
				$(this).val("");
			});
			// 复位下拉菜单
			$("#clearDiv").find('textarea').each(function() {
				$(this).val("");
			});
		});
	});
	function changeImg(objImg){
	     var most = 790;//设置最大宽度
	     if(objImg.width > most){
	         var scaling = 1-(objImg.width-most)/objImg.width;   
	         //计算缩小比例
	         objImg.width = objImg.width*scaling;
	         objImg.height = objImg.height;            //img元素没有设置高度时将自动等比例缩小
	         //objImg.height = objImg.height*scaling;    //img元素设置高度时需进行等比例缩小
	     }
	}
</script>
</head>
<form id="addProblemForm" name="addProblemForm" enctype="multipart/form-data" class="form-horizontal" role="form">
	<div id="clearDiv" class="container">
		<div class="row clearfix">
			<div class="col-md-12 column" style="padding-top:10px">
				<div class="form-group">
					<label for="title" class="col-sm-2 control-label">问题现象：</label>
					<div class="col-sm-10">
						<input style="width:40%;padding-left: 3px; padding-right: 5px; padding-top: 4px;" class="form-control" id="title" name="title" type="text" />
					</div>
				</div>
				<div class="form-group">
					<label for="productId" class="col-sm-2 control-label">所属产品：</label>
					<div class="col-sm-10">
						<select id="productId" name="productId"  style="float:left;width:135px;padding-left: 3px; padding-right: 5px; padding-top: 6px;padding-bottom: 6px;">
							<option value='0' selected='selected'>--请选择--</option>
							<c:forEach var="product" items="${productList }">
								<option value="${product.id }">${product.productName }</option>
							</c:forEach>
						</select>
						<label style="float:left;width:20%" for="moduleId" class="col-sm-2 control-label">所属模块：</label>
						<select id="moduleId" name="moduleId"  style="float:left;width:135px;padding-left: 3px; padding-right: 5px; padding-top: 6px;padding-bottom: 6px;">
							<option value='0' selected='selected'>--请选择--</option>
						</select>
					</div>
				</div>
				<div class="form-group">
					<label for="priorityLevelId" class="col-sm-2 control-label">优先等级：</label>
					<div class="col-sm-10">
						<select id="priorityLevelId" name="priorityLevelId"  style="float:left;width:135px;padding-left: 3px; padding-right: 5px; padding-top: 6px;padding-bottom: 6px;">
							<option value='0' selected='selected'>--请选择--</option>
							<option value='1' >低</option>
							<option value='2' >中</option>
							<option value='3' >高</option>
							<option value='4' >紧急</option>
						</select>
						<label style="float:left;width:20%" for="isClosed" class="col-sm-2 control-label">是否关闭：</label>
						<select id="isClosed" name="isClosed"  style="float:left;width:135px;padding-left: 3px; padding-right: 5px; padding-top: 6px;padding-bottom: 6px;">
							<option value='0' selected='selected'>--请选择--</option>
							<option value='1' >是</option>
							<option value='2' >否</option>
						</select>
					</div>
				</div>
				<div class="form-group">
					<label for="problemTypeId" class="col-sm-2 control-label">问题类型：</label>
					<div class="col-sm-10">
						<select id="problemTypeId" name="problemTypeId"  style="float:left;width:135px;padding-left: 3px; padding-right: 5px; padding-top: 6px;padding-bottom: 6px;">
							<option value='0' selected='selected'>--请选择--</option>
								<c:forEach var="problemType" items="${problemTypeList }">
									<option value="${problemType.id }">${problemType.problemTypeName }</option>
								</c:forEach>
						</select>
						<input style="width:60%;padding-left: 3px; padding-right: 5px; padding-top: 4px;" class="form-control" id="problemTypeDesc" name="problemTypeDesc" type="text" />
					</div>
				</div>
				<div class="form-group">
					<label for="causeMethod" class="col-sm-2 control-label">原因&方法：</label>
					<div class="col-sm-10" id="causeMethod" name="causeMethod">
						<p>发生原因：</p>
						<br/>
						<br/>
						<br/>
						<br/>
						<p>处理方法：</p>
						<img src="D:\\files\\workspace\\PMS\\src\\main\\webapp\\static\\image\\test\\20180117114617.jpg" style="max-width:100%;" class="w-e-selected">
					</div>
				</div>
			</div>
			<div class="col-md-8 column">
				<div align="center" class="form-group">
					<button id="submitBtn" type="button" class="btn btn-default">提交数据</button>
					<button id="clearBtn" style="margin-left: 100px;" type="button" class="btn btn-default">清除填写</button>
				</div>
			</div>
		</div>
	</div>
</form>